layui.config({
    base: '../../layui/' //此处路径请自行处理, 可以使用绝对路径
}).extend({
    formSelects: 'formSelects-v4',
    xmSelect: "xm-select"
}).use(['jquery', 'formSelects', 'form','layer','xmSelect'], function () {
    const form = layui.form
        , layer = layui.layer
        , xmSelect = layui.xmSelect
        , $ = layui.jquery;

    let  selectHosts
    function getAllHost() {
        $.ajax({
            url: '/admHosts/getAll',
            dataType: "json",
            type: "GET",
            success: function (result) {
                const allHosts =[]
                const data = result.data
                for (let i = 0; i < data.length; i++) {
                    const hosts = {
                        name :data[i].hostName+":"+data[i].ip,
                        value : data[i].id
                    };
                    allHosts.push(hosts);
                }
                //渲染数据
                selectHosts = xmSelect.render({
                    el: '#host_id',
                    data: allHosts,
                })
            }
        })
    }
    $("#close").on('click', function () {
        const index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
        parent.layer.close(index); //再执行关闭
    });
    form.on('submit(add)', function (data) {
        const params = data.field;
        let selectHostsData = selectHosts.getValue()
        let hostId = ''
        for (let i = 0; i < selectHostsData.length; i++) {
            let value = selectHostsData[i].value;
            hostId+=value+","
        }
        hostId = hostId.substring(0,hostId.length - 1)
        params.hostId = hostId
        submit($, params);
        return false;
    });


    function submit($, params) {
        $.ajax({
            url: '/admDocker',
            data: JSON.stringify(params),
            dataType: "json",
            contentType: "application/json;charset=utf-8",
            type: "POST",
            success: function (result) {
                layer.msg(result.data, {icon: 1, time: 1000}, function () {
                    CloseWin();
                })
            }
        })
    }
    //关闭页面
    function CloseWin() {
        parent.location.reload(); // 父页面刷新
        const index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
        parent.layer.close(index); //再执行关闭
    }

    $(function () {
        getServer("")
        getAllHost()
    })

    nameInput = function(e){
        const val = $("#groupName").val();
        getServer(val)

    }
    let dropData

    function getServer(ip) {
        $.ajax({
            type: "GET",//方法类型
            dataType: "json",//预期服务器返回的数据类型
            url: "/server/getAllServer?ip="+ip,//url
            success: function (result) {
                dropData = result
                $("#serverId").html("");
                var html = "";
                $("#serverId").html("<option value=\"\">请选择服务器</option>");
                if (result != null) {
                    $.each(result, function (index, item) {
                        html += "<option  value='" + item.id + "'>" + item.ip + "</option>";
                    })
                }
                $("#serverId").append(html);
                form.render('select');
                if (ip != null && ip !=''){
                    $(".layui-form-select").addClass("layui-form-selected")
                }
            },
            error: function () {
                alert("异常！");
            }
        });
    }

    // 监听下拉框改变事件,修改输入框中的内容
    form.on("select(serverId)",function(data){
        let value=data.value
        let selectObj=dropData.filter(item=>{
            return item.id==value
        })
        $("#groupName").val(selectObj[0].ip);
    })


});

